I am using this code
<v-list-item>
<v-btn
@click="onDownloadFile(document)"
:disabled=getFileExtention
>Download as pdf</v-btn
>
</v-list-item>
where getFileExtention returns boolean
getFileExtention() {
//console.log(this.document.extension==="pdf");
return this.document.extension === "pdf";
}
but its not working , still saying [Vue warn]: Invalid prop: type check failed for prop "disabled". Expected Boolean, got Function . Kindly help
define getFileExtension as computed property :
computed:{
getFileExtention() {
//console.log(this.document.extension==="pdf");
return this.document.extension === "pdf";
}
}
then use it like :disabled="getFileExtention"
You need to define getFileExtention as methods for this.
methods:{
getFileExtention() {
return this.document.extension === "pdf";
}
}
But if you want the caching ability based on reactive dependencies, you can also use computed property
computed:{
getFileExtention() {
return this.document.extension === "pdf";
}
}
Add Boolean(getFileExtension) in your :disabled, this way you are saying that your variable is a boolean, and the warning will disappear.
<v-list-item>
<v-btn
@click="onDownloadFile(document)"
:disabled="Boolean(getFileExtention)"
>Download as pdf
</v-btn>
</v-list-item>